<script setup>
import { reactive } from "vue";
import { mainRoutes } from "../router";
const state = reactive({
  navList:mainRoutes,
});
</script>
<template>
  <nav
    id="sidebarMenu"
    class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse"
  >
    <div class="sidebar-sticky pt-3">
      <ul class="nav flex-column">
        <li class="nav-item" v-for="item in state.navList" :key="item.name">
          <router-link class="nav-link active" :to="item.path">
            <span data-feather="home"></span>
            {{ item.name }}
          </router-link>
        </li>
      </ul>
    </div>
  </nav>
</template>